/* 全局样式 */
* {
	margin: 0px;
	padding: 0px;
}

a {
	text-decoration: none;
}

li {
	list-style: none;
}

img {
	vertical-align: center;
}


/* 头部样式 */
header {
	height: 56px;
	background: #25292e;

}

.header {
	width: 1000px;
	height: 56px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.logo {
	width: 95px;
	height: 38px;
	background: url("../img/all.png") no-repeat;
	opacity: 0.7;
	transition: 0.5s;
}

.logo:hover {
	opacity: 1;
}

.header>ul {
	height: 56px;
	display: flex;
	align-items: center;
	color: #666;
	font-size: 14px;
}

.line {
	font-size: 10px;
}

.header>ul>li {
	margin-right: 15px;
}

.header .line {
	margin-right: 0px;
}

.header>ul>li>a {
	color: #666;
}

.header>ul>li.login>a,
.header>ul>li.register>a {
	color: #ccc;
}

.header>ul>li:hover {
	color: #ccc;
}

.header>ul>li:hover>a {
	color: #ccc;
}

.welcome-content{
	height:56px;
	line-height: 56px;
	position:relative;
}

.welcome-content>span{
	color:#ccc;
	font-size: 14px;
}

.welcome-content .self-content{
	position: absolute;
	top:56px;
	left:0px;
	background-color: #3F474E;
	width: 180px;
	z-index: 100;
	display: none;
}

.welcome-content:hover .self-content{
	display: block;
}

.welcome-content .self-content>a{
	color: #666;
	display: block;
	font-size: 12px;
	height:50px;
	line-height: 50px;
	padding-left: 10px;
	border-bottom: 1px solid #999;
}

.welcome-content .self-content>a:hover{
	color:#ccc;
	background-color: #3F474F;
}

.welcome-content .self-content>a:last-of-type{
	border-bottom: 1px solid transparent;
	background-color:#292F34;
	font-size: 15px;
	text-align: center;
	padding: 0px 5px;
}

.header .cart,
.header .message {
	height: 56px;
	padding: 0px 16px;
	margin-right: 0px;
	line-height: 56px;
	position: relative;
}

.header .product {
	padding-left: 15px;
}

.cart:hover,
.message:hover {
	background-color: #292F34;
}

.cart_subnav {
	width: 320px;
	background-color: #3F474E;
	position: absolute;
	top: 56px;
	left: 0px;
	display: none;
	z-index: 999;
}

.cart:hover .cart_subnav {
	display: block;
}

/* 暂无商品 */
.cart_subnav .no-list {
	height: 70px;
	line-height: 70px;
	text-align: center;
	font-size: 14px;
	color: #ccc;
}

.cart_subnav .no-list:hover {
	background-color: #292F34;
}

/* 购物车 */
.cart .cart_subnav .cart-btn {
	height: 45px;
	background-color: rgb(125, 191, 210);
	color: white;
	line-height: 45px;
	text-align: center;
	transition: 0.5s;
}

.cart .cart_subnav .cart-btn:hover {
	background-color: #96C8E0;
}

/* 商品 */
.cart .cart_subnav .cart_list {
	height: 250px;
	overflow-y: scroll;
}

/* 设置滚动条 */
.cart_list::-webkit-scrollbar{
	width: 0px;
}

/* .cart_list::-webkit-scrollbar-track{
	background-color: red;
} */

/* .cart_list::-webkit-scrollbar-thumb{
	background-color: #96C8E0;
} */

/* .cart_list::-webkit-scrollbar-button{
	background-color: pink;
} */

.cart_list>li.list {
	padding: 14px;
	display: flex;
	line-height: 1px;
	border-bottom: 1px solid #666;
}

.cart_list>li.list>a>img {
	width: 64px;
	height: 64px;
	padding-right: 10px;
}

.cart_list>li.list>div {
	height: 64px;
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: space-between;
}

.cart_list>li.list>div p {
	line-height: 12px;
	font-size: 12px;
	color: #ccc;
}

/* 导航样式 */
nav {
	width: 1000px;
	height: 41px;
	border-bottom: 4px solid #ededed;
	margin: 0px auto;
	display: flex;
}

.nav {
	display: flex;
	align-items: center;
}

.nav>li {
	width: 120px;
	height: 45px;
	text-align: center;
	line-height: 45px;
	margin-right: 15px;
	position: relative;
	top: 2px;
}

.nav>li:hover {
	height: 41px;
	border-bottom: 4px solid #25292E;
}

nav>.nav>li:first-of-type {
	text-align: left;
	width: 82px;
}

.nav>li>a {
	color: #666;
	font-size: 15px;
}

.search {
	display: flex;
	flex: 1;
	height: 41px;
	border-bottom: 4px solid #ededed;
}

.search:hover {
	height: 41px;
	border-bottom: 4px solid #25292E;
}

.search>input {
	border: 0px;
	height: 20px;
	margin-top: 12px;
	outline: none;
}

.search>span {
	width: 43px;
	height: 38px;
	margin-top: 5px;
	background: url("../img/all.png") no-repeat -157px -150px;
}

.subnav {
	width: 1000px;
	background-color: white;
	position: absolute;
	left: -97px;
	top: 49px;
	padding-top: 30px;
	display: none;
	z-index: 998;
}

.subnav .subnav_list {
	width: 770px;
	float: left;
	display: flex;
	flex-wrap: wrap;
}

.subnav .subnav_list>li {
	padding: 0px 60px 10px 0px;
}

.subnav .subnav_list .nullNodeE,
.subnav .subnav_list .nullNodeS,
.subnav .subnav_list .nullNodeL{
	width: 620px;
	height:94px;
	font-size: 12px;
	padding-left: 0px;
	text-align: left;
	display: none;
	border-top: 1px solid #aaa;
	flex-wrap: wrap;
}

.subnav .subnav_list .nullNodeE>a,
.subnav .subnav_list .nullNodeS>a,
.subnav .subnav_list .nullNodeL>a{
	color:#666;
	padding-left:50px;
}

.subnav .subnav_list .nullNodeE>a:first-of-type,
.subnav .subnav_list .nullNodeE>a:last-of-type{
	padding-left: 10px;
}

.subnav .subnav_list .nullNodeE>a:hover,
.subnav .subnav_list .nullNodeS>a:hover,
.subnav .subnav_list .nullNodeL>a:hover{
	color:#333;
}

.subnav .subnav_list>li>a>p {
	font-size: 14px;
	color: #333;
	line-height: 18px;
	font-weight: bold;
}

.subnav .subnav_list img {
	width: 40px;
}

.subnav .subnav_img {
	float: right;
	width: 230px;
}

.subnav .subnav_img>img {
	width: 100%;
}

nav>ul>li:hover .subnav {
	display: block;
}

/* 通用商品列表样式 */
.base-shop {
	width: 1000px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.base-cart {
	width: 316px;
	height: 366px;
	margin-bottom: 30px;
}

.base-cart-up {
	width: 316px;
	height: 316px;
	position: relative;
}

.base-cart-up>img {
	width: 316px;
	height: 316px;
}

.base-cart-brand {
	width: 316px;
	height: 40px;
	padding-top: 10px;
	display: flex;
	justify-content: space-between;
}

.base-cart-brand>div {
	height: 40px;
	line-height: 40px;
	color: #999;
	font-size: 14px;
}

.base-cart-brand>div>img {
	height: 40px;
	vertical-align: middle;
	margin-right: 10px;
}

.base-cart-brand>div:last-of-type>span:last-of-type {
	color: #CCD7D9;
}

.base-mask {
	width: 316px;
	height: 316px;
	background: rgba(0, 0, 0, 0.7);
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

.base-cart-up:hover .base-mask {
	display: block;
}

.base-mask :first-of-type {
	color: aquamarine;
	font-size: 24px;
	font-weight: bold;
	line-height: 48px;
	margin-left: 20px;
}

.base-mask>p:nth-of-type(2),
.base-mask>p:nth-of-type(3) {
	color: white;
	text-align: center;
	padding: 0px 20px;
	text-wrap: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.base-mask>p:nth-of-type(2) {
	margin-top: 90px;
	font-size: 14px;
	font-weight: 600;
}

.base-mask>p:nth-of-type(3) {
	font-size: 12px;
}

/* 按钮样式 */
.m-btn {
	width: 140px;
	height: 42px;
	line-height: 42px;
	border: 3px solid #25292E;
	margin: 100px auto;
	text-align: center;
	font-style: italic;
	font-size: 18px;
	cursor: pointer;
	transition: .5s;
}

.m-btn:hover {
	background: #25292E;
	color: white;
}

/* 底部样式 */
.index-bottom {
	height: 248px;
	background: #fbfdfe;
	border-top:1px solid #ededed;
	margin-top:90px;
}

.our-shop {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	padding: 30px 0px 0px;
}

.our-shop>a {
	color: #666;
}

.our-shop>a :first-of-type {
	margin-right: 15px;
	font-size: 19px;
	font-weight: 500;
	position: relative;
	top: 0;
	left: 0px;
	animation: server .5s linear infinite alternate;
}

@keyframes server {
	to {
		left: -10px;
	}
}

.our-shop>a :last-of-type {
	font-size: 15px;
	font-weight: 600;
}

.bottom-server {
	width: 1000px;
	height: 100px;
	padding: 40px 0px;
	text-align: center;
	margin: 13px auto 0px;
}

.servers {
	width: 1000px;
	height: 100px;
	display: flex;
	justify-content: space-between;
}

.servers>li>div {
	display: flex;
	height: 60px;
}

.servers>li>div>span {
	width: 57px;
	height: 62px;
}

.servers>li:nth-of-type(1)>div>span {
	background: url("../img/all.png") no-repeat 0px -354px;
}

.servers>li:nth-of-type(2)>div>span {
	background: url("../img/all.png") no-repeat -154px -219px;
}

.servers>li:nth-of-type(3)>div>span {
	background: url("../img/all.png") no-repeat -56px -350px;
}

.servers>li:nth-of-type(4)>div>span {
	background: url("../img/all.png") no-repeat -113px -350px;
}

.servers>li>div>div {
	margin: 10px 0px 0px 10px;
}

.servers>li>div>div>p {
	font-size: 14px;
	height: 24px;
	font-weight: 400;
	color: #666;
	line-height: 24px;
	text-align: left;
}

.servers>li>div>div>p:last-of-type {
	color: #999;
}

/* 页脚样式 */
.footer {
	height: 250px;
	border-top: #25292e 1px solid;
	background: #25292e;
}

.footer-content {
	width: 1000px;
	height: 250px;
	margin: 0 auto;
}

.footer-l {
	width: 800px;
	height: 250px;
	float: left;
}

.phone {
	width: 196px;
	height: 44px;
	color: #5c5c5c;
	cursor: pointer;
	position: relative;
}

.phone>span {
	margin-top: 40px;
}

.phone:hover .phone-content>p {
	color: #b1b2b2;
}

.phone>span {
	width: 25px;
	height: 44px;
	float: left;
	padding-left: 30px;
	background: url("../img/all.png") no-repeat -175px 0px;
}

.phone-content {
	width: 196px;
	height: 44px;
	padding-top: 40px;
}

.phone-content>p:first-of-type {
	font-size: 16px;
}

.phone-content>p:last-of-type {
	margin-top: 5px;
	font-size: 12px;
}

.about-lc {
	display: flex;
	height: 14px;
	margin-top: 60px;
}

.about-lc>li {
	padding: 0 8px 0 10px
}

.about-lc>li.line-lc {
	padding: 0px;
}

.about-lc>li:first-of-type {
	padding-left: 0px;
}

.about-lc>li>a {
	color: #5c5c5c;
	font-size: 14px;
	line-height: 14px;
}

.line-lc {
	color: #5c5c5c;
	font-size: 12px;
	line-height: 22px;
}

.about-lc>li:hover>a {
	color: #b1b2b2;
}

.lc-content {
	margin-top: 8px;
}

.lc-content>p {
	font-size: 12px;
	padding: 1px 0px 2px 0px;
	color: #5c5c5c;
}

.phone-position {
	width: 280px;
	height: 150px;
	background-color: white;
	position: absolute;
	bottom: 45px;
	left: 0px;
	display: none;
}

.phone-content:hover .phone-position {
	display: block;
}

.phone-position>p {
	width: 100px;
	height: 140px;
	float: left;
	padding: 0px 20px;
}

.phone-position>p>span {
	width: 100px;
	font-size: 14px;
	display: block;
}

.phone-position>p:nth-of-type(1)>span:nth-of-type(1) {
	width: 100px;
	height: 100px;
	background: url("../img/all.png") no-repeat 0px -47px;
	float: left;
	margin: 5px 0px;
}

.phone-position>p:nth-of-type(2)>span:nth-of-type(1) {
	width: 100px;
	height: 100px;
	background: url("../img/all.png") no-repeat -102px -47px;
	float: left;
	margin: 5px 0px;
}

.phone-position>p>span:nth-of-type(2) {
	margin: 120px 100px 0px 0px;
}

.footer-r {
	width: 200px;
	height: 75px;
	float: right;
}

.slogin {
	display: flex;
	position:relative;
}

.wechat-content{
	float:left;
	width:30px;
	height:69px;
	padding-top:47px;
}


.wechat {
	width: 29px;
	height: 22px;
	margin-right: 27px;
	float:left;
	background: url("../img/all.png") no-repeat -99px 0px;
}

.wechat:hover {
	width: 29px;
	height: 22px;
	background: url("../img/all.png") no-repeat -99px -24px; 
}

.webo {
	width: 28px;
	height: 22px;
	background: url("../img/all.png") no-repeat -147px 2px;
	margin:45px 29px 0px 27px;
}

.webo:hover  {
	width: 27px;
	height: 20px;
	background: url("../img/icon.png") no-repeat -148px -22px;
}

.dou {
	width: 20px;
	height: 22px;
	margin-top:47px;
	background: url("../img/all.png") no-repeat -129px 0px;
}

.dou:hover {
	width: 20px;
	height: 22px;
	background: url("../img/all.png") no-repeat -129px -24px;
}

.wechat-er{
	width:145px;
	height:141px;
	background:url("../img/all.png") no-repeat 0px -148px;
	position:absolute;
	top:-142px;
	left:-72px;
	display:none;
}

.wechat-content:hover .wechat-er{
	display:block;
}

/* 回到顶部按钮样式 */
.back-btn{
	width:60px;
	height:60px;
	position:fixed;
	right:40px;
	bottom:40px;
}

.back-top{
	width:60px;
	height:60px;
	background:url("../img/all.png") no-repeat -21px -814px;
	opacity:0.8;
	transition:0.7s;
}

.back-top:hover{
	opacity:1;
}

/* 联系客服按钮样式 */
.call-btn{
	width:90px;
	height:30px;
	background:#42b8f4;
	border-radius:5px;
	font-size:14px;
	color:white;
	line-height:30px;
	position:fixed;
	bottom:1px;
	right:10px;
	padding-left:10px;
}
